<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
     <meta charset="UTF-8">
     <title>这是标准版本的runninggo</title>
      <script type="text/javascript" src="js/jquery-easyui-1.4.2/jquery.min.js"></script>
     <script type="text/javascript" src="js/jquery-easyui-1.4.2/jquery.easyui.min.js" charset="utf-8"></script>
     <script type="text/javascript" src="js/jquery-easyui-1.4.2/locale/easyui-lang-zh_CN.js"></script></head>
     <link rel="stylesheet" href="js/jquery-easyui-1.4.2/themes/default/easyui.css" type="text/css"></link>
     <link rel="stylesheet" href="js/jquery-easyui-1.4.2/themes/icon.css" type="text/css"></link>
  
     <script type="text/javascript">
     $(function () {
         /*树形菜单点击处理*/
         $("#tree").tree({
              url : 'treeData.json',
              lines : true,
			  onClick : function (node) {
							if (node.attributes) {
								openTab(node.text, node.attributes.url);
							}
						}
         });     
	
	/*在右边center区域打开菜单，新增tab*/
	function openTab(title, url) {
    //判断是否已存在
    if ($("#tabs").tabs('exists', title)) {  
        $('#tabs').tabs('select', title);
    } else {
        //新增tab
        $('#tabs').tabs('add', {
            title : title,
            closable : true,
            content : createTabContent(url)
        });
    }
	}
	/* 生成tab内容 */
	function createTabContent(url){
		return '<iframe fit=true padding=0 style="width:100%;height:100%;" scrolling="auto" frameborder="0" src="' + url + '"></iframe>';
	}
	
	/*绑定tabs的右键菜单*/
        $("#tabs").tabs({
            onContextMenu : function (e, title) {
                e.preventDefault();
                $('#tabsMenu').menu('show', {
                    left : e.pageX,
                    top : e.pageY
                }).data("tabTitle", title);
            }
        });
         
        /*实例化menu的onClick事件*/
        $("#tabsMenu").menu({
                onClick : function (item) {
                CloseTab(this, item.name);
            }
        });
         
        /*右键菜单关闭事件的处理*/
        function CloseTab(curTab, itemName) {
            //选中的tab的title
            var curTabTitle = $(curTab).data("tabTitle");
            //所有tab
            var allTabs = $("#tabs").tabs("tabs");
            //所有tab的title的数组
            var allTabsTitle = [];
            //关闭菜单
            if (itemName === "close") {
                $("#tabs").tabs("close", curTabTitle);
                return;
            }       
            //遍历所有tab
            $.each(allTabs, function () {
                var optTab = $(this).panel("options");
                //关闭其他条件：(1)tab可关闭；(2)选中的不关闭；(3)菜单名为closeother
                if (optTab.closable && optTab.title != curTabTitle && itemName === "closeother") {
                    //往tab的title数组中添加title
                    allTabsTitle.push(optTab.title);
                //关闭所有
                } else if (optTab.closable && itemName === "closeall") {
                    allTabsTitle.push(optTab.title);
                }
            }); 
            //for循环逐个关闭
            for (var i = 0; i < allTabsTitle.length; i++) {
                $("#tabs").tabs("close", allTabsTitle[i]);
            }
        }
		   /*切换主题*/
        changeTheme=function (themeName) {
            var $easyuiTheme = $('#easyuiTheme');
            var url = $easyuiTheme.attr('href');
            var href = url.substring(0, url.indexOf('themes')) + 'themes/' + themeName + '/easyui.css';
            $easyuiTheme.attr('href', href);
            var $iframe = $('iframe');
            if ($iframe.length > 0) {
                for (var i = 0; i < $iframe.length; i++) {
                    var ifr = $iframe[i];
                    $(ifr).contents().find('#easyuiTheme').attr('href', href);
                }
            }
        };
        
        //登录对话框
      	 $('#dialog_login').dialog({
      		 modal:true,
      		 title:'登陆pos系统',
      		 width:400,
      		 height:260,
      		 closable:false,
      		 buttons:[{text:'登陆',
      			       iconCls:'icon-load',
      			       handler:function(){
      			    	   $.ajax({
      			    		   url:'sale_login.action',
      			    		   data:$('#form_login').serialize(),
      			    		   dataType:'json',
      			    		   success:function(result){
      			    			   if(result&&result.success){
      			    				   $.messager.show({title:'提示',msg:result.msg});
      			    				   $('#dialog_login').dialog('close');
                                        }
      			    			   else
      			    				   {   $.messager.show({title:'提示',msg:result.msg});}}
      			    	   });
      			    	   
      			    	   
      			       }},
      			       {text:'退出',
          			       iconCls:'icon-load',
          			       handler:function(){}}],
          			       });//
        
        
});//
	</script>
</head>

<body class="easyui-layout">
 <!-- ==================登陆开始===================== -->
    <div class="easyui-dialog" title="登陆" id="dialog_login" closed="true">
        <form id="form_login">
            <table  align="center"><br>
              <tr><td>用户名：</td><td><input type="text" name="name"/></td></tr><br><br>
              <tr></tr>
              <tr><td>密码：</td><td><input type="password" name="password"/></td></tr>
            
            </table>
        </form>
     </div>
  <!-- ==================登陆结束===================== -->
     <div id="head" data-options="region:'north'" style="height:60px;">
         <div align="center" style="height:30px;font-size:30px;background:url(images/head.gif) no-repeat 0 0;">MISP</div>
		 <div style="text-align: right;">
            <a href="javascript:void(0);" class="easyui-menubutton" data-options="menu:'#theme',iconCls:'icon-filter'">主题</a>
        </div>
        <div id="theme" style="width: 100px; display: none;">
            <div onclick="changeTheme('default');">默认</div>
            <div onclick="changeTheme('gray');">灰色</div>
            <div onclick="changeTheme('black');">黑色</div>
            <div onclick="changeTheme('metro');">Metro</div>
            <div onclick="changeTheme('bootstrap');">Bootstrap</div>
        </div>
     </div>
     <div id="foot" data-options="region:'south'" style="height:30px;text-align: center;background: #D2E0F2">CopyRight:SCAU</div>
     <div id="nav" data-options="region:'west',split:true" style="width:200px" title="导航">
              <div id="navMenu" class="easyui-accordion" data-options="fit:true,border:false">
                   <div title="系统管理" data-options="iconCls:'icon-save'" style="overflow:auto;padding:10px;">
                   </div>
                   <div title="基础数据" data-options="iconCls:'icon-reload',selected:true" style="padding:10px;">
                   <ul id="tree" data-options="lines:true"></ul>    
                   </div>    
              </div>
     </div>
     <div id="mainPanle" data-options="region:'center'">
		<div id="tabsMenu" class="easyui-menu" style="width:150px;">
			<div data-options="name:'close'">关闭</div>
			<div class="menu-sep"></div>
			<div data-options="name:'closeall'">全部关闭</div>
			<div data-options="name:'closeother'">除此之外全部关闭</div>
		</div>
        <div id="tabs" class="easyui-tabs" data-options="fit:true, border: false" >
             <div title="About" data-options="iconCls:'icon-tip'" padding=0>
                 <iframe src="about.html" style="border: 0; width: 100%; height: 100%;" frameBorder="0"></iframe>
             </div>
        </div>    
     </div>
</body>
</html>